import React from 'react'
import { NavBar, Toast } from 'react-vant';
import { LocationO } from '@react-vant/icons';
import { Calendar, Cell } from 'react-vant';
import {useSelector,useDispatch} from "react-redux"
import * as action from "../action"
import {useNavigate} from "react-router-dom"
function Weight() {
    const navigate = useNavigate()
    const dispatch = useDispatch()
    const store = useSelector(state=>({...state.appreducer}))

    const formatDate = date => ` ${date.getFullYear()}/${date.getMonth() + 1}/${date.getDate()}`
    return (
        <div>
            {/* <NavBar
                title="身体测评"
                leftText="返回"
                rightText="按钮"
                onClickLeft={() => Toast('返回')}
                onClickRight={() => Toast('按钮')}
            /> */}
            <div className='select-box'>
                <b>请选择体重</b>
                <div>
                    <LocationO /> <span>历史记录</span>
                </div>

            </div>
            <div className='weight-number'>
                <h1>60.2kg</h1>
            </div>
            <div className='rule'>
            </div>
            <div>
                <Calendar  
              
                onConfirm={v => {
                            console.log(v);
                            let myweight = formatDate(v)
                            dispatch(action.setDate(myweight))
                            navigate("/line")
                             
                            }}
                            
                            >
                    {(val, actions) => (
                        
                        <Cell
                           
                            isLink
                            title='单个日期'
                            value={val ? val.toLocaleDateString() : '请选择日期'}
                            onClick={() => 
                                
                                actions.open()
                            }
                           
                        />
                    )}
                </Calendar>
            </div>
        </div>
    )
}

export default Weight